<template>
    <div>
        <el-row :gutter="10">
            <!-- 今日销售额 -->
            <el-col :span="6"><Card>
                <template #header>
                    <div>今日销售额</div>
                </template>
                <template #number>
                    <div>{{data.salesToday}}</div>
                </template>
                <template #charts>
                    <div>日同比:{{data.salesGrowthLastDay}}<svg t="1673069878236" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4810" width="14" height="14"><path d="M886.4 736h-182.4c-19.2 0-32 12.8-32 32s12.8 32 32 32h224c35.2 0 64-28.8 64-64v-224c0-19.2-12.8-32-32-32s-32 12.8-32 32v172.8l-297.6-297.6c-6.4-6.4-16-9.6-22.4-9.6-9.6 0-16 3.2-22.4 9.6l-204.8 204.8-294.4-294.4c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l316.8 316.8c6.4 6.4 16 9.6 22.4 9.6 9.6 0 16-3.2 22.4-9.6l204.8-204.8 278.4 281.6z" fill="#d81e06" p-id="4811"></path></svg></div>
                    <div>月同比:{{data.salesGrowthLastMonth}}<svg t="1673069903939" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6027" width="14" height="14"><path d="M928 361.6v182.4c0 19.2 12.8 32 32 32s32-12.8 32-32v-224c0-35.2-28.8-64-64-64h-224c-19.2 0-32 12.8-32 32s12.8 32 32 32h176l-272 272-204.8-204.8c-6.4-6.4-16-9.6-22.4-9.6-9.6 0-16 3.2-22.4 9.6l-316.8 316.8c-12.8 12.8-12.8 32 0 44.8 12.8 12.8 32 12.8 44.8 0l294.4-294.4 204.8 204.8c6.4 6.4 16 9.6 22.4 9.6 9.6 0 16-3.2 22.4-9.6l297.6-297.6z" fill="#1afa29" p-id="6028"></path></svg></div>
                </template>
                <template #footer>
                    <div>昨日销售额:{{data.salesLastDay}}</div>
                </template>
            </Card></el-col>
            <!-- 今日订单 -->
            <el-col :span="6"><Card>
                <template #header>
                    <div>今日订单</div>
                </template>
                <template #number>
                    <div>{{data.orderToday}}</div>
                </template>
                <template #charts>
                    <Line></Line>
                </template>
                <template #footer>
                    <div>昨日销售额:{{data.orderLastDay}}</div>
                </template>
            </Card></el-col>
            <!-- 交易用户 -->
            <el-col :span="6"><Card>
                <template #header>
                    <div>今日订单</div>
                </template>
                <template #number>
                    <div>{{data.orderUser}}</div>
                </template>
                <template #charts>
                    <Bar></Bar>
                </template>
                <template #footer>
                    <div>退货率:{{data.returnRate}}</div>
                </template>
            </Card></el-col>
            <el-col :span="6"><Card>
                
            </Card></el-col>
        </el-row>
    </div>
</template>

<script setup lang="ts">
import Card from './Card/index.vue'
import Line from './Line/index.vue'
import Bar from './Bar/index.vue'

//接收参数
defineProps(['data'])

</script>

<style scoped>

</style>